{include file="../application/admin/view/health/base.html" /}
<style>
	.create-btn {
		width: 120px;
		padding: 0 5px;
	}
</style>
<div class="container-box" id="taskIndex" v-cloak v-loading="allAjax">
	<div class="custom-tabs-wrap">
		<el-tabs v-model="where.category" @tab-click="categoryTabClick">
			<el-tab-pane v-for="(item,index) in category_map" :key="index" :label="item.label"
			             :name="String(item.name)"></el-tab-pane>
		</el-tabs>
	</div>
	<div class="custom-filter-wrap display-flex">
		<div class="custom-refresh display-flex custom-refresh-button" @click="getData">
			<i class="el-icon-refresh"></i>
		</div>
		{if condition = "$auth->check('health/website/task/add')"}
		<div class="btn-common create-btn" @click="operation('create')">
			<i class="el-icon-plus"></i>
			创建{{category_label}}
		</div>
		{/if}
	</div>
	<div class="custom-table-wrap" v-loading="tableAjax">
		<el-table :data="taskData" border style="width: 100%">
			<el-table-column prop="id" label="ID" width="60">
			</el-table-column>
			<el-table-column prop="name" align="center" label="任务名称">
			</el-table-column>
			<el-table-column prop="description" align="center" label="任务描述">
			</el-table-column>
			<el-table-column prop="complete_num" align="center" label="完成次数">
			</el-table-column>
			<el-table-column prop="award_type_text" align="center" label="奖励类型">
			</el-table-column>
			<el-table-column prop="award_value" align="center" label="奖励值">
			</el-table-column>
			<el-table-column prop="complete_way_text" align="center" label="完成方式">
			</el-table-column>
			<el-table-column prop="updated_at" align="center" label="更新时间">
			</el-table-column>
			<el-table-column label="操作" align="center" width="160" fixed="right">
				<template slot-scope="scope">
					<div class="table-operate-text" :style="{'color':scope.row.status==1?'':'#FF5959'}"
					     @click="operation('status',scope.row.id,scope.row.status)">
						{{scope.row.status_text}}
					</div>
					<span class="table-edit-text" @click="operation('edit',scope.row.id)">编辑
                    </span>
					<span v-if="scope.row.category!=3" class="table-delete-text"
					      @click.stop="operation('del',scope.row.id)">删除</span>
				</template>
			</el-table-column>
		</el-table>
		<div class="pagination-container">
			<el-pagination :hide-on-single-page="true" background @size-change="pageSizeChange"
			               @current-change="pageCurrentChange" :current-page="currentPage"
			               :page-sizes="[10, 20, 30, 40]"
			               :page-size="10" layout="total, sizes, prev, pager, next, jumper" :total="totalPage">
			</el-pagination>
		</div>
	</div>
</div>